<template>
  <!--地区选择 五级-->
  <div :style="{width:Pspan+'%'}" style="float: left;">
    <el-select class="diqu" v-model="diqu" :placeholder="areaObj?areaObj.name:'请选择'" @change="xuan" clearable filterable >
      <el-option v-for="(a,index) in value" :label="a.name" :key="index" :value="a.id">
      </el-option>
    </el-select>
  </div>
</template>

<script>
  export default {
    name: 'diqu',
    props: ['value', 'span', 'jibie','id','areaObj'],
    data() {
      return {
        Pspan: this.span,
        diqu: this.id?this.id:'',
        nr:this.value
      }
    },
    mounted() {},
    watch: {
      'span': function(n, o) {
        this.Pspan = n
      },
      'nr': function(n, o) {
        this.value = n
      },
      'id': function(n, o) {
        this.diqu = n
      },
    },
    methods: {
      xuan(val) { //选中地区
        var diqu = {
          val: val,
          level: this.jibie
        }
        this.$emit("test", diqu)
      }
    }
  };
</script>

<style scoped>

</style>
